<!doctype html>
<html class="no-js" lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>管理员设备维修系统</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- favicon
		============================================ -->
    <link rel="shortcut icon" type="image/x-icon" href="admin/img/logo/icon.png">
    <!-- Google Fonts
		============================================ -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,700,900" rel="stylesheet">
    <!-- Bootstrap CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/bootstrap.min.css">
    <!-- Bootstrap CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/font-awesome.min.css">
	<!-- nalika Icon CSS
		============================================ -->
    <link rel="stylesheet" href="/admin/css/nalika-icon.css">
    <!-- owl.carousel CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/owl.carousel.css">
    <link rel="stylesheet" href="admin/css/owl.theme.css">
    <link rel="stylesheet" href="admin/css/owl.transitions.css">
    <!-- animate CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/animate.css">
    <!-- normalize CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/normalize.css">
    <!-- meanmenu icon CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/meanmenu.min.css">
    <!-- main CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/main.css">
    <!-- morrisjs CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/morrisjs/morris.css">
    <!-- mCustomScrollbar CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/scrollbar/jquery.mCustomScrollbar.min.css">
    <!-- metisMenu CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/metisMenu/metisMenu.min.css">
    <link rel="stylesheet" href="admin/css/metisMenu/metisMenu-vertical.css">
    <!-- calendar CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/calendar/fullcalendar.min.css">
    <link rel="stylesheet" href="admin/css/calendar/fullcalendar.print.min.css">
    <!-- style CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/style.css">
    <!-- responsive CSS
		============================================ -->
    <link rel="stylesheet" href="admin/css/responsive.css">
    <!-- modernizr JS
		============================================ -->



<!--    <link href="assets/admin/css/simplebar.css" rel="stylesheet"/>-->
<!--    &lt;!&ndash; Bootstrap core CSS&ndash;&gt;-->
<!--    <link href="assets/admin/css/bootstrap.min.css" rel="stylesheet"/>-->
<!--    &lt;!&ndash; animate CSS&ndash;&gt;-->
<!--    <link href="assets/admin/css/animate.css" rel="stylesheet" type="text/css"/>-->
<!--    &lt;!&ndash; Icons CSS&ndash;&gt;-->
<!--    <link href="assets/admin/css/icons.css" rel="stylesheet" type="text/css"/>-->
<!--    &lt;!&ndash; Sidebar CSS&ndash;&gt;-->
<!--    <link href="assets/admin/css/sidebar-menu.css" rel="stylesheet"/>-->
<!--    &lt;!&ndash; Custom Style&ndash;&gt;-->
<!--    <link href="assets/admin/css/app-style.css" rel="stylesheet"/>-->
<!--    <script src="admin/js/vendor/modernizr-2.8.3.min.js"></script>-->


</head>

<body>
    <!--[if lt IE 8]>
          <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>&ndash;&gt;-->
<!--        <![endif]&ndash;&gt;-->

    <div class="left-sidebar-pro">
        <nav id="sidebar" class="">
            <div class="sidebar-header">
                <div class="header-right-info">
<!--                <a href="index-2.html"><img class="main-logo" src="admin/img/logo/icon.png" alt="" width="50" height="50"/>-->
                    <h3>设备维修系统</h3>
                </a>
                <strong><img src="admin/img/logo/icon.png" alt="" /></strong>
                </div>
            </div>
			<div class="nalika-profile">
				<div class="profile-dtl">
					<a href="#"><img src="admin/img/logo/manager.png" alt="" /></a>
					<h2>公司任命 <span class="min-dtn">管理员</span></h2>
				</div>
				<div class="profile-social-dtl">

				</div>
			</div>
            <div class="left-custom-menu-adp-wrap comment-scrollbar">
                <nav class="sidebar-nav left-sidebar-menu-pro">
                    <ul class="metismenu" id="menu1">
                        <li class="active">
                            <a class="has-arrow" href="index-2.html">
                                <i class="icon nalika-forms icon-wrap"></i>
                                <span class="mini-click-non">维修管理</span>
                            </a>
                            <ul class="submenu-angle" aria-expanded="true">

                                <li><a title="charts" th:href="@{/showStatistics(AId=${AId})}"><span class="mini-sub-pro">维修信息统计</span></a></li>
                                <li><a title="Lists" th:href="@{/toCheckTasks(AId=${AId},pageNum=1)}"><span class="mini-sub-pro">维修信息汇总</span></a></li>

                            </ul>
                        </li>

                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="icon nalika-new-file icon-wrap"></i> <span class="mini-click-non">人员管理</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="clients" th:href="@{/toCheckClients(AId=${AId},pageNum=1)}"><span class="mini-sub-pro">职员汇总</span></a></li>
                                <li><a title="workers" th:href="@{/toCheckWorkers(AId=${AId},pageNum=1)}"><span class="mini-sub-pro">维修人员汇总</span></a></li>

                            </ul>
                        </li>

                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="icon nalika-home icon-wrap"></i> <span class="mini-click-non">库存管理</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="storage" th:href="@{/showWarehouse(AId=${AId})}"><span class="mini-sub-pro">库存查看</span></a></li>
                                <li><a title="check" th:href="@{/toCheckMaterial(AId=${AId},pageNum=1)}"><span class="mini-sub-pro">设备申请审核</span></a></li>

                            </ul>
                        </li>

                        <li>
                            <a th:href="@{/log(AId=${AId},pageNum=1,startTime='2021-07-14T00:00',endTime='2021-07-14T23:59')}" aria-expanded="false"><img src="admin/img/log.png" style="width: 20px;margin-right: 10px;"><span class="mini-click-non">日志</span></a>
                        </li>




                    </ul>
                </nav>
            </div>
        </nav>
    </div>
    <!-- Start Welcome area -->
    <div class="all-content-wrapper">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="logo-pro">
                        <a href="index-2.html"><img class="main-logo" src="admin/img/logo/logo.png" alt="" /></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="header-advance-area">
            <div class="header-top-area">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="header-top-wraper">
                                <div class="row">
                                    <div class="col-lg-1 col-md-0 col-sm-1 col-xs-12">
                                        <div class="menu-switcher-pro">
                                            <button type="button" id="sidebarCollapse" class="btn bar-button-pro header-drl-controller-btn btn-info navbar-btn">
													<i class="icon nalika-menu-task"></i>
												</button>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-7 col-sm-6 col-xs-12">
                                        <div class="header-top-menu tabl-d-n">
                                            <div class="breadcome-heading">
												<form role="search" class="">
													<input type="text" placeholder="Search..." class="form-control">
													<a href=""><i class="fa fa-search"></i></a>
												</form>
											</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-5 col-md-5 col-sm-12 col-xs-12">
                                        <div class="header-right-info">
                                            <ul class="nav navbar-nav mai-top-nav header-right-menu">


                                                <li class="nav-item">
                                                    <a href="#" data-toggle="dropdown" role="button" aria-expanded="false" class="nav-link dropdown-toggle">
															<i class="icon nalika-user nalika-user-rounded header-riht-inf" aria-hidden="true"></i>
															<span class="admin-name">管理员</span>
															<i class="icon nalika-down-arrow nalika-angle-dw nalika-icon"></i>
														</a>
                                                    <ul role="menu" class="dropdown-header-top author-log dropdown-menu animated zoomIn">


                                                        <li><a th:href="@{/lock(AId=${AId})}"><span class="icon nalika-diamond author-log-ic icon nalika-unlocked author-log-ic"></span> 锁屏</a>
                                                        </li>
                                                        <li><a th:href="@{/priority(AId=${AId})}"><span class="icon nalika-settings author-log-ic"></span> 我的权限</a>
                                                        </li>
                                                        <li><a href="#" data-toggle="modal" data-target="#exampleModalLiveLogout"><span class="icon nalika-diamond author-log-ic" ></span> 退出登录</a>
                                                        </li>
                                                    </ul>
                                                </li>

                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Mobile Menu end -->
            <div class="breadcome-area">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="breadcome-list">
                                <div class="row">
                                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                                        <div class="breadcomb-wp">
											<div class="breadcomb-icon">
												<i class="icon nalika-bar-chart icon-wrap"></i>
											</div>
											<div class="breadcomb-ctn">
												<h1 style="color: white">维修信息统计表查阅</h1>

											</div>
										</div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

<!--        <div class="dashtwo-order-area mg-tb-30">-->
<!--            <div class="container-fluid">-->
<!--                <div class="row">-->

<!--                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">-->
<!--                        <div class="analytics-nalika-wrap reso-mg-b-30">-->
<!--                            <div class="skill-content-3 analytics-nalika analytics-nalika4">-->
<!--                                <div class="skill">-->
<!--                                    <div class="progress">-->
<!--                                        <div class="lead-content">-->
<!--                                            <h3>85%</h3>-->
<!--                                            <p>Server down 8:32 pm</p>-->
<!--                                        </div>-->
<!--                                        <div class="progress-bar wow fadeInLeft" data-progress="85%" style="width: 85%;" data-wow-duration="1.5s" data-wow-delay="1.2s"><span>85%</span> </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">-->
<!--                        <div class="analytics-nalika-wrap reso-mg-b-30 res-mg-t-30">-->
<!--                            <div class="skill-content-3 analytics-nalika analytics-nalika3">-->
<!--                                <div class="skill">-->
<!--                                    <div class="progress progress-bt">-->
<!--                                        <div class="lead-content">-->
<!--                                            <h3>80%</h3>-->
<!--                                            <p>Server down 10:32 pm</p>-->
<!--                                        </div>-->
<!--                                        <div class="progress-bar wow fadeInLeft" data-progress="80%" style="width: 80%;" data-wow-duration="1.5s" data-wow-delay="1.2s"><span>80%</span> </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">-->
<!--                        <div class="analytics-nalika-wrap res-mg-t-30">-->
<!--                            <div class="skill-content-3 analytics-nalika analytics-nalika2">-->
<!--                                <div class="skill">-->
<!--                                    <div class="progress progress-bt">-->
<!--                                        <div class="lead-content">-->
<!--                                            <h3>93%</h3>-->
<!--                                            <p>Server down 10:32 pm</p>-->
<!--                                        </div>-->
<!--                                        <div class="progress-bar wow fadeInLeft" data-progress="93%" style="width: 93%;" data-wow-duration="1.5s" data-wow-delay="1.2s"><span>93%</span> </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->

        <div class="section-admin container-fluid">
            <div class="row admin text-center">

            <div class="col-md-12">

            <div class="row">
            <div class="col-12 col-lg-8 col-xl-8">
                <div class="card">
                    <div class="card-header"> <h4 class="text-left text-uppercase" style="color: white"><b>其他设备维修与已有类型维修曲线图</b></h4>
                        <div class="card-action">
                            <div class="dropdown">
                                <a href="javascript:void(this);" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">

                                </a>
                                <div class="dropdown-menu dropdown-menu-right">

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <ul class="list-inline">
                            <li class="list-inline-item" style="color: white"><i class="fa fa-circle mr-2 text-white"  ></i>其他设备</li>
                            <li class="list-inline-item" style="color: rgb(226,109,154)"><i class="fa fa-circle mr-2 text-light" ></i>已有类型设备</li>
                        </ul>
                        <div class="chart-container-1"><div class="chartjs-size-monitor" style="position: absolute; inset: 0px; overflow: hidden; pointer-events: none; visibility: hidden; z-index: -1;"><div class="chartjs-size-monitor-expand" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:1000000px;height:1000000px;left:0;top:0"></div></div><div class="chartjs-size-monitor-shrink" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:200%;height:200%;left:0; top:0"></div></div></div>
                            <canvas id="chart1" width="1456" height="520" style="display: block; width: 728px; height: 260px;" class="chartjs-render-monitor"></canvas>
                        </div>
                    </div>

                    <div class="row m-0 row-group text-center border-top border-light-3">
                        <div class="col-12 col-lg-4">
                            <div class="p-3">
                                <h5 class="mb-0" style="color: white" th:text="${index2VO.addThisMonth()}+'次'">7次</h5>
                                <small class="mb-0" style="color: white">本月已有类型维修次数 <!-- <span> <i class="fa fa-arrow-up"></i>1%</span>--></small>
                            </div>
                        </div>
                        <div class="col-12 col-lg-4">
                            <div class="p-3">
                                <h5 class="mb-0" style="color: white" th:text="${index2VO.numOfOther}+'次'">12次</h5>
                                <small class="mb-0" style="color: white">本月其他设备维修次数 <!--span> <i class="fa fa-arrow-up"></i> 12.65%</span--></small>
                            </div>
                        </div>
                        <div class="col-12 col-lg-4">
                            <div class="p-3">
                                <h5 class="mb-0" style="color: white"
                                    th:if="${index2VO.addThisMonth()}+${index2VO.numOfOther} gt ${index2VO.addLastMonth()}+${index2VO.lastNumOfOther}">与上月相比维修次数增加</h5>
                                <small class="mb-0" style="color: white" th:if="${index2VO.addThisMonth()}+${index2VO.numOfOther} gt ${index2VO.addLastMonth()}+${index2VO.lastNumOfOther}"><span> <i class="fa fa-arrow-up"></i> </span></small>
                                <h5 class="mb-0" style="color: white"
                                    th:if="${index2VO.addThisMonth()}+${index2VO.numOfOther} lt ${index2VO.addLastMonth()}+${index2VO.lastNumOfOther}">与上月相比维修次数减少</h5>
                                <small class="mb-0" style="color: white" th:if="${index2VO.addThisMonth()}+${index2VO.numOfOther} lt ${index2VO.addLastMonth()}+${index2VO.lastNumOfOther}"><span> <i class="fa fa-arrow-down"></i> </span></small>
                                <h5 class="mb-0" style="color: white"
                                    th:if="${index2VO.addThisMonth()}+${index2VO.numOfOther} eq ${index2VO.addLastMonth()}+${index2VO.lastNumOfOther}">与上月相比维修次数不变</h5>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

            <div class="col-12 col-lg-4 col-xl-4">
                <div class="card">
                    <div class="card-header"> <h4 class="text-left text-uppercase" style="color: white"><b>已有类型维修占比</b></h4>
                        <div class="card-action">
                            <div class="dropdown">
                                <a href="javascript:void(this);" class="dropdown-toggle dropdown-toggle-nocaret" data-toggle="dropdown">

                                </a>
                                <div class="dropdown-menu dropdown-menu-right">

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="chart-container-2"><div class="chartjs-size-monitor" style="position: absolute; inset: 0px; overflow: hidden; pointer-events: none; visibility: hidden; z-index: -1;"><div class="chartjs-size-monitor-expand" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:1000000px;height:1000000px;left:0;top:0"></div></div><div class="chartjs-size-monitor-shrink" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:200%;height:200%;left:0; top:0"></div></div></div>
                            <canvas id="chart2" width="664" height="376" style="display: block; width: 332px; height: 188px;" class="chartjs-render-monitor"></canvas>
                        </div>
                    </div>
                    <div class="table-responsive">
                        <table class="table align-items-center">
                            <tbody>
                            <tr style="color: #66cccc">
                                <td ><i class="fa fa-circle text-white mr-2"></i> 电脑维修数占比</td>

                                <td th:text="${index2VO.rateThisComputer()}">80%</td>
                            </tr>
                            <tr style="color: #ccccff">
                                <td ><i class="fa fa-circle text-light-1 mr-2"></i>打印机维修占比</td>

                                <td th:text="${index2VO.rateThisPrinter()}">15%</td>
                            </tr>
                            <tr style="color: white">
                                <td ><i class="fa fa-circle text-light-2 mr-2"></i>灯泡维修数占比</td>

                                <td th:text="${index2VO.rateThisLight()}">3%</td>
                            </tr>
                            <tr style="color: #ccffcc">
                                <td ><i class="fa fa-circle text-light-3 mr-2"></i>空调维修数占比</td>

                                <td th:text="${index2VO.rateThisAir()}">2%</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    </div>
        <div class="section-admin container-fluid">
            <div class="row admin text-center">
                <div class="col-md-12">
                    <div class="row">
                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                            <div class="admin-content analysis-progrebar-ctn res-mg-t-15">
                                <h4 class="text-left text-uppercase"><b>电脑维修</b></h4>
                                <div class="row vertical-center-box vertical-center-box-tablet">
                                    <div class="col-xs-3 mar-bot-15 text-left">
                                        <label class="label bg-green" th:text="${index2VO.rateLastComputer()}" id="computerRateO">30% <i class="fa fa-level-up" aria-hidden="true"></i></label>
                                    </div>
                                    <div class="col-xs-9 cus-gh-hd-pro">
                                        <h2 class="text-right no-margin">以上月相比</h2>
                                    </div>
                                </div>
                                <div class="progress progress-mini">
                                    <div style="width: 78%;" class="progress-bar bg-green" id="computerRate"></div>
                                </div>
                            </div>



                        </div>

                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12" style="margin-bottom:1px;">
                            <div class="admin-content analysis-progrebar-ctn res-mg-t-30">
                                <h4 class="text-left text-uppercase"><b>打印机维修</b></h4>
                                <div class="row vertical-center-box vertical-center-box-tablet">
                                    <div class="text-left col-xs-3 mar-bot-15">
                                        <label class="label bg-red" th:text="${index2VO.rateLastPrinter()}" id="printerRateO">15% <i class="fa fa-level-down" aria-hidden="true"></i></label>
                                    </div>
                                    <div class="col-xs-9 cus-gh-hd-pro">
                                        <h2 class="text-right no-margin">与上月相比</h2>
                                    </div>
                                </div>
                                <div class="progress progress-mini">
                                    <div style="width: 38%;" class="progress-bar progress-bar-danger bg-red" id="printerRate"></div>
                                </div>
                            </div>



                        </div>

                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                            <div class="admin-content analysis-progrebar-ctn res-mg-t-30">
                                <h4 class="text-left text-uppercase"><b>空调</b></h4>
                                <div class="row vertical-center-box vertical-center-box-tablet">
                                    <div class="text-left col-xs-3 mar-bot-15">
                                        <label class="label bg-blue" th:text="${index2VO.rateLastAir()}" id="airRateO">50% <i class="fa fa-level-up" aria-hidden="true"></i></label>
                                    </div>
                                    <div class="col-xs-9 cus-gh-hd-pro">
                                        <h2 class="text-right no-margin">与上月相比</h2>
                                    </div>
                                </div>
                                <div class="progress progress-mini">
                                    <div style="width: 60%;" class="progress-bar bg-blue" id="airRate"></div>
                                </div>
                            </div>



                        </div>

                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                            <div class="admin-content analysis-progrebar-ctn res-mg-t-30">
                                <h4 class="text-left text-uppercase"><b>灯泡</b></h4>
                                <div class="row vertical-center-box vertical-center-box-tablet">
                                    <div class="text-left col-xs-3 mar-bot-15">
                                        <label class="label bg-purple" th:text="${index2VO.rateLastLight()}" id="lightRateO">20% <i class="fa fa-level-up" aria-hidden="true"></i></label>
                                    </div>
                                    <div class="col-xs-9 cus-gh-hd-pro">
                                        <h2 class="text-right no-margin">与上月相比</h2>
                                    </div>
                                </div>
                                <div class="progress progress-mini">
                                    <div style="width: 60%;" class="progress-bar bg-purple" id="lightRate"></div>
                                </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="product-sales-area mg-tb-30">

        </div>

        <div class="author-area-pro">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                        <div class="personal-info-wrap">
                            <div class="widget-head-info-box">
                                <div class="persoanl-widget-hd">
                                    <h2>银牌维修员</h2>

                                </div>
                                <img src="admin/img/notification/silver.png" class="img-circle circle-border m-b-md" alt="profile">
                                <div class="social-widget-result">
                                    <h3 style="color:#C0C0C0" th:text="${employeeList.get(1).getEId()}"> ID </h3>
                                </div>

                            </div>
<!--                            <div class="widget-text-box">-->
                                <div class="product-status-wrap">
                                <table>
                                    <tr>
                                        <th> <h4>维修单数</h4></th>
                                        <th> <h4>职员评分</h4></th>
                                    </tr>
                                    <tr>
                                        <td><h4 th:text="${index2VO.getSNumber()}">20</h4></td>
                                        <td><h4 th:text="${employeeList.get(1).getECredit()}">非常满意</h4></td>
                                    </tr>
                                </table>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                        <div class="author-widgets-single res-mg-t-30">
                            <div class="author-wiget-inner">
                                <div class="perso-img">
                                    <img src="admin/img/notification/gold.png" class="img-circle circle-border m-b-md" alt="profile">
                                </div>
                                <div class="persoanl-widget-hd persoanl1-widget-hd">
                                    <h2>金牌维修员</h2>

                                </div>
                                <div class="social-widget-result social-widget1-result">
                                    <h3 style="color: #FFD700" th:text="${employeeList.get(0).getEId()}">ID</h3>
                                </div>
                            </div>
                            <div class="product-status-wrap">
                                <table>
                                    <tr>
                                        <th> <h4>维修单数</h4></th>
                                        <th> <h4>职员评分</h4></th>
                                    </tr>
                                    <tr>
                                        <td><h4 th:text="${index2VO.getGNumber()}">10086</h4></td>
                                        <td><h4 th:text="${employeeList.get(0).getECredit()}">非常满意</h4></td>
                                    </tr>
                                </table>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                        <div class="personal-info-wrap personal-info-ano res-mg-t-30">
                            <div class="widget-head-info-box">
                                <div class="persoanl-widget-hd">
                                    <h2>铜牌维修员</h2>

                                </div>
                                <img src="admin/img/notification/meta.png" class="img-circle circle-border m-b-md" alt="profile">
                                <div class="social-widget-result">
                                    <h3 style="color: #B8860B"th:text="${employeeList.get(2).getEId()}">ID</h3>
                                </div>
                            </div>
                            <div class="product-status-wrap">
                                <table>
                                    <tr>
                                        <th> <h4>维修单数</h4></th>
                                        <th> <h4>职员评分</h4></th>
                                    </tr>
                                    <tr>
                                        <td><h4 th:text="${index2VO.getMNumber()}">18</h4></td>
                                        <td><h4 th:text="${employeeList.get(2).getECredit()}">非常满意</h4></td>
                                    </tr>
                                </table>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="footer-copyright-area">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="footer-copy-right">
                            <p>  到底了！</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="exampleModalLiveLogout" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalLiveLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" >确认要退出吗</h4>

                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                    <a href="/signOut"><button type="button" class="btn btn-primary" >退出</button></a>
                </div>
            </div>
        </div>
    </div>


    <!-- jquery
		============================================ -->
    <script src="admin/js/vendor/jquery-1.12.4.min.js"></script>
    <!-- bootstrap JS
		============================================ -->
    <script src="admin/js/bootstrap.min.js"></script>
    <!-- wow JS
		============================================ -->
    <script src="admin/js/wow.min.js"></script>
    <!-- price-slider JS
		============================================ -->
    <script src="admin/js/jquery-price-slider.js"></script>
    <!-- meanmenu JS
		============================================ -->
    <script src="admin/js/jquery.meanmenu.js"></script>
    <!-- owl.carousel JS
		============================================ -->
    <script src="admin/js/owl.carousel.min.js"></script>
    <!-- sticky JS
		============================================ -->
    <script src="admin/js/jquery.sticky.js"></script>
    <!-- scrollUp JS
		============================================ -->
    <script src="admin/js/jquery.scrollUp.min.js"></script>
    <!-- mCustomScrollbar JS
		============================================ -->
    <script src="admin/js/scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="admin/js/scrollbar/mCustomScrollbar-active.js"></script>
    <!-- metisMenu JS
		============================================ -->
    <script src="admin/js/metisMenu/metisMenu.min.js"></script>
    <script src="admin/js/metisMenu/metisMenu-active.js"></script>
    <!-- morrisjs JS
		============================================ -->
    <script src="admin/js/sparkline/jquery.sparkline.min.js"></script>
    <script src="admin/js/sparkline/jquery.charts-sparkline.js"></script>
    <!-- calendar JS
		============================================ -->
    <script src="admin/js/calendar/moment.min.js"></script>
    <script src="admin/js/calendar/fullcalendar.min.js"></script>
    <script src="admin/js/calendar/fullcalendar-active.js"></script>
	<!-- float JS
		============================================ -->
    <script src="admin/js/flot/jquery.flot.js"></script>
    <script src="admin/js/flot/jquery.flot.resize.js"></script>
    <script src="admin/js/flot/jquery.flot.pie.js"></script>
    <script src="admin/js/flot/jquery.flot.tooltip.min.js"></script>
    <script src="admin/js/flot/jquery.flot.orderBars.js"></script>
    <script src="admin/js/flot/curvedLines.js"></script>
    <script src="admin/js/flot/flot-active.js"></script>
    <!-- plugins JS
		============================================ -->
    <script src="admin/js/plugins.js"></script>
    <!-- main JS
		============================================ -->
    <script src="admin/js/main.js"></script>




    <!-- Bootstrap core JavaScript-->
    <script src="admin/assets/js/jquery.min.js"></script>
    <script src="admin/assets/js/popper.min.js"></script>
    <script src="admin/assets/js/bootstrap.min.js"></script>

    <!-- simplebar js -->
    <script src="admin/assets/js/simplebar.js"></script>
    <!-- sidebar-menu js -->
    <script src="admin/assets/js/sidebar-menu.js"></script>
    <!-- loader scripts -->
    <script src="admin/assets/js/jquery.loading-indicator.js"></script>
    <!-- Custom scripts -->
    <script src="admin/assets/js/app-script.js"></script>

    <!-- Chart js -->

    <script src="admin/assets/js/Chart.min.js"></script>
    <!-- Custom scripts -->
    <script src="admin/assets/js/app-script.js"></script>
    <!-- Index js -->
    <script th:inline="javascript">
        $(function() {
            "use strict";

            var index2VO = [[${index2VO}]];
            $("#computerRate").attr("style","width:"+$("#computerRateO").text()+";") ;
            $("#printerRate").attr("style","width:"+$("#printerRateO").text()+";");
            $("#airRate").attr("style","width:"+$("#airRateO").text()+";");
            $("#lightRate").attr("style","width:"+$("#lightRateO").text()+";");
            // chart 1

            var ctx = document.getElementById('chart1').getContext('2d');

            var myChart = new Chart(ctx, {
                type: 'line',
                data: {
                    labels: ["Jan", "Feb", "Mar", "Apr", "May"],
                    datasets: [{
                        label: '其他设备类型',
                        data: index2VO.other,
                        backgroundColor: 'rgba(255,255,255,0.7)',
                        borderColor: "transparent",
                        pointRadius :"0",
                        borderWidth: 3
                    }, {
                        label: '已有设备类型',
                        data: index2VO.already,
                        backgroundColor: "rgb(226,109,154,0.8)",
                        borderColor: "transparent",
                        pointRadius :"0",
                        borderWidth: 1
                    }]
                },
                options: {
                    maintainAspectRatio: false,
                    legend: {
                        display: false,
                        labels: {
                            fontColor: '#ddd',
                            boxWidth:40
                        }
                    },
                    tooltips: {
                        displayColors:false
                    },
                    scales: {
                        xAxes: [{
                            ticks: {
                                beginAtZero:true,
                                fontColor: '#ddd'
                            },
                            gridLines: {
                                display: true ,
                                color: "rgba(221, 221, 221, 0.08)"
                            },
                        }],
                        yAxes: [{
                            ticks: {
                                beginAtZero:true,
                                fontColor: '#ddd'
                            },
                            gridLines: {
                                display: true ,
                                color: "rgba(221, 221, 221, 0.08)"
                            },
                        }]
                    }

                }
            });


            // chart 2

            var ctx = document.getElementById("chart2").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'doughnut',
                data: {
                    labels: ["电脑维修次数", "电灯维修次数", "打印机维修次数", "空调维修次数"],
                    datasets: [{
                        backgroundColor: [

                            "#66cccc",
                            "#ccccff",
                            "#ffffff",
                            "#ccffcc",
                        ],
                        data: [index2VO.numOfComputer, index2VO.numOfLight, index2VO.numOfPrinter, index2VO.numOfAir],
                        borderWidth: [0, 0, 0, 0]
                    }]
                },
                options: {
                    maintainAspectRatio: false,
                    legend: {
                        position :"bottom",
                        display: false,
                        labels: {
                            fontColor: '#ddd',
                            boxWidth:15
                        }
                    }
                    ,
                    tooltips: {
                        displayColors:false
                    }
                }
            });

        });

    </script>
</body>

</html>